<script src="<?=base_url()?>resources/js/jquery.validate.min.js"></script>

<script type="text/javascript">

jQuery(document).ready(function(){
	
	jQuery( "#form-validate" ).validate({
				 rules:{
					'usr[_username]':{ required: true,email: true, "remote":{url: '<?= site_url()?>/vendedor/validarNombreUsuario',
																			 type: "post",
																			 data:{
																				 email: function(){
																					 return jQuery('#form-validate :input[name="usr[_username]"]').val();
																					}
																				}
																			}
									 },
					'usr[_password]': {required: true,minlength: 5},
					'contra': {required: true, equalTo: "#pass"},
				 },
				 messages:{
					 'usr[_username]': {remote: jQuery.validator.format("{0} ya está registrado.")},
					 'usr[_password]': {minlength: "Minimo 5 caracteres"},
					 'contra': {equalTo: "Los campos no coinciden"}
				 }
	});

	// utilizamos la función post, para hacer una llamada AJAX
	$.post("<?=site_url()?>/core/main/obtenerDepartamento", { idPais:52 }, 
    function(html){ $('#departamento').append(html); } );
	
	$("#departamento").change(function() {
		//Limpiamos el select de municipios
		$('#municipio').html('');
		// utilizamos la función post, para hacer una llamada AJAX
		$.post("<?=site_url()?>/core/main/obtenerMunicipio", { idDepartamento : $(this).val() }, 
		function(html){ $('#municipio').append(html); } );

    });
      
	jQuery('#password').keypress(function(e) {
        if(e.keyCode == 13) {
			validar();
        }
    });
			
});

function validar(){
	
	jQuery('#login-alert').show();
	jQuery('#div-alert').html('Verificando ....');	
	jQuery.post('<?= site_url()?>/vendedor/login', 
	{ usuario : jQuery('#user').val(), pass : jQuery('#password').val() }, 
	function(data){
		 if(data == 'success'){
			window.location = '<?= site_url()?>/equino/panel_lista';
		 }else{
			jQuery('#div-alert').html('Nombre de usuario y/o contraseña incorrectos. Por favor intente nuevamente.');
		 }
	 })
	 
}

</script>	

</head>
<body>

<? $this->load->view('core/core_menu') ?>

<section id="midTitle">
	<div class="top-guia auto_margin">
	<div class="guia"><a href="<?= site_url()?>">INICIO</a>   /  REGISTRO / </div>
	<h2>Ingresar</h2>
	</div>
</section>

<section id="Main">
	<div class="mainContent auto_margin">
	<div class="row">
		<div class="col-sm-6">
		<div class="areaForm">
			<div class="row">
				<h2>Ingresar</h2>
				<p>Ya está registrad@? Ingrese y venda su equino.</p>
			  <div class="col-xs-12">
			  	<span class="ilab">Correo electrónico:</span>
			    <input type="text" class="form-control" id="user" >
			  </div>
			  <div class="col-xs-12">
			  	<span class="ilab">Contraseña:</span>
			    <input type="password" class="form-control" id="password" >
			  </div>
			  <div class="col-xs-12">
			  <span class="btt-label">
			  <button type="button" class="btn btn-default btn-lg active" onClick="validar()">Ingresar</button>
			  </span>
			  </div>
			 </div>
             <span id="login-alert" style="display:none"><div class="alert alert-danger alert-dismissible" role="alert" id="div-alert"></div></span>
		</div></div>
		
		<div class="col-sm-6" style="border-left: 1px solid #EDEDED;">
			<div class="areaForm">
			<h2>Registro</h2>
			<p>¿Aún no está registrad@? Inscribase y venda su equino facilmente.</p>
				<?php
				$attributes = array('name'     => 'formulario',
					'id' => 'form-validate',
   					'method'   => 'post');

		echo form_open('/vendedor/guardar_vendedor',$attributes);
				?>
                      <div class="row">
				  <div class="col-xs-12">
				  	<span class="ilab">Correo electrónico (será su nombre de usuario):</span>
				    <input type="text" class="form-control" placeholder="Email" name="usr[_username]" id="usuario" required>
				  </div>
				  <div class="col-xs-12">
				  	<span class="ilab">Contraseña:</span>
				    <input type="password" class="form-control" placeholder="Contraseña" name="usr[_password]" id="pass" required>
				  </div>
				  <div class="col-xs-12">
				  	<span class="ilab">Repetir Contraseña:</span>
				    <input type="password" class="form-control" name="contra" id="contra" placeholder="" required >
				  </div>
				  <div class="col-xs-12">
				  	<span class="ilab">Nombres:</span>
				    <input type="text" class="form-control" name="usr[_nombres]" placeholder="Nombres" required > 
				  </div>				  
                  <div class="col-xs-12">
				  	<span class="ilab">Criadero:</span>
				    <input type="text" class="form-control" name="usr[_criadero]" placeholder="" required > 
				  </div>
				  <div class="col-xs-6">
				  	<span class="ilab">Teléfono fijo:</span>
				    <input type="text" class="form-control" name="usr[_telefono]" placeholder="">
				  </div>
				  <div class="col-xs-6">
				  	<span class="ilab">Teléfono celular:</span>
				    <input type="text" class="form-control"  name="usr[_movil]"  placeholder="">
				  </div>
				  
                  <div class="col-xs-4">
				  	<span class="ilab">País:</span>
                    <select name="usr[_pais]" id="pais"  class="form-control">
                     <option value="52">Colombia</option>
					 <?
                            foreach($pais as $d)
                            {	
                                if($d['PAI_PK'] != 52)
                                echo '<option value="'.$d['PAI_PK'].'">'.$d['PAI_NOMBRE'].'</option>';
                            }
                     ?>
                    </select>
				  </div>
				  
                  <div class="col-xs-4">
				  	<span class="ilab">Departamento:</span>
				   <div id="div_lista_departamentos"></div>
                    <select name="departamento" id="departamento" class="form-control">
                    	<option value="0" selected="selected" >-Seleccione uno-</option>
                    </select>
                  </div>
                  
				  <div class="col-xs-4">
				  	<span class="ilab">Ciudad:</span>
				    <select name="usr[_ciudad]" class="form-control" id="municipio" placeholder="">
                    </select>
				  </div>
                  
				  <div class="col-xs-12">
				  	<span class="ilab"> Dirección:</span>
				    <input type="text" class="form-control" name="usr[_direccion]" placeholder="Dirección" > 
				  </div>
	                  
				  <div class="col-xs-12">
				  <span class="btt-label">
				  <button type="submit" class="btn btn-default btn-lg active">Registrarse</button>
				  </span>
                  </div>
				 </div>
                 </form>
                 
			</div>
		</div>
		
	</div>
		
	</div>
</section>


<section id="areaSlog">
	<div class="textMiddle auto_margin">
		<span class="tt1">Facilidad, comodidad y agilidad</span>
		<span class="tt2">en la venta de su caballo</span>
		<a href="" class="vButton">VENDA SU EQUINO</a>
	</div>
</section>

<section id="areaBanners" class="auto_margin">
	<div class="row">
		<div class="col-sm-4"><img src="http://placehold.it/318x140"></div>
		<div class="col-sm-4"><img src="http://placehold.it/318x140"></div>
		<div class="col-sm-4"><img src="http://placehold.it/318x140"></div>
	</div>
</section>
